<template>
  <div>
    <BasicTable @register="registerTable" :searchInfo="searchInfo">
      <template #toolbar>
        <a-button type="primary" @click="handleAdd()">充值</a-button>
      </template>
    </BasicTable>
    <BalanceLogDrawer @register="registerDrawer" @success="handleSuccess" />
  </div>
</template>
<script lang="ts" setup name="balanceLog">
import { ActionItem, BasicTable, TableAction } from '@apps/antd-admin/src/components/table';
import { useBaseTable } from '@apps/antd-admin/src/hooks';
import { Api } from './data/api';
import { columns } from './data/data';
import { useMessage } from '@apps/antd-admin/src/hooks/web/useMessage';
import BalanceLogDrawer from './components/BalanceLogDrawer.vue';
import {useDrawer} from "@apps/antd-admin/src/components/drawer";
import {reactive} from "vue";
const searchInfo = reactive<Recordable>({});
const { createMessage, createConfirm } = useMessage();
const { tableContext, handleSuccess } = useBaseTable({
  designScope: 'balanceLog-template',
  tableProps: {
    //表格标题
    //主键字段
    rowKey: 'balanceLogId',
    //列表接口
    listUrl: Api.page,
    //列定义
    columns,
    useSearchForm:false,
    showActionColumn:false,
    //操作列配置
    actionColumn: {
      width: 240,
      title: '操作',
      dataIndex: 'action',
      slots: { customRender: 'action' },
      fixed: 'right',
    },

  },
});

const [registerTable, { getForm, setProps, reload }, { rowSelection, hasSelectedRows, selectedRow }] = tableContext;
const [registerDrawer, { openDrawer }] = useDrawer();
function  handleAdd(){
  let record = { userId: searchInfo.userId,balanceId:searchInfo.balanceId };
  openDrawer(true, {
    isUpdate: false,
    record
  });
}

function setSearchInfoProps(userId,balanceId) {
  console.info('userId', userId);
  searchInfo.userId=userId;
  searchInfo.balanceId=balanceId;
}

defineExpose({
  setSearchInfoProps,
});
</script>
